define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-theme', 'template'], function ($, undefined, Backend, Table, Form, Echarts) {
    var Controller = {
        myChart1: function () {
            // 指定图表的配置项和数据
            let option = {
                title: {
                    text: '订单趋势',
                    subtext: ''
                },
                tooltip: {
                    trigger: 'axis'
                },
                legend: {
                    data: ['订单数']
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataView: {
                            show: true,
                            readOnly: false
                        },
                        magicType: {
                            show: true,
                            type: ['line', 'bar']
                        },
                        restore: {
                            show: true
                        },
                        saveAsImage: {
                            show: true
                        }
                    }
                },
                calculable: true,
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: []
                },
                yAxis: {},
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                series: [{
                    name: '订单数',
                    type: 'line',
                    data: [],
                    markPoint: {
                        data: [{
                            type: 'max',
                            name: '最大值'
                        },
                            {
                                type: 'min',
                                name: '最小值'
                            }
                        ]
                    },
                    markLine: {
                        data: [{
                            type: 'average',
                            name: '平均值'
                        }]
                    }
                }]
            };

            // 初始化图表
            let myChart = Echarts.init($('#echarts1')[0], 'walden');
            myChart.setOption(option);

            var date = '';

            // 时间范围回调
            $("#form1 .datetimerange").data("callback", function (start, end) {
                console.log('callback', start, end);
                date = start.format(this.locale.format) + " - " + end.format(this.locale.format);
                $(this.element).val(date);
                refresh();
            });

            var si = null;

            function refresh() {
                if (! date) {
                    return;
                }
                si && clearTimeout(si);
                si = setTimeout(function () {
                    Fast.api.ajax({
                        url: 'yunfood/dashboard/orderStat',
                        data: {
                            date: date,
                        },
                        loading: false
                    }, function (res) {
                        option.xAxis.data = res.categoryList;
                        option.series[0].data = res.orderCountList;
                        myChart.clear();
                        myChart.setOption(option, true);

                        return false;
                    });
                }, 50);
            }

            return {
                chart: myChart,
                refresh: refresh
            };
        },
        index: function () {
            let charts = {}
            charts.chart1 = this.myChart1();

            // 自适应
            $(window).resize(function () {
                for (let i in charts) {
                    charts[i].chart.resize();
                }
            });

            // 点击刷新
            $(document).on("click", "a.btn-refresh", function () {
                let val = $(this).data('chart');
                charts[val].chart.resize();
                charts[val].refresh();  // date 存在空值
            });

            // 每隔60s定时刷新图表
            setInterval(function () {
                $(".btn-refresh").trigger("click");
            }, 60000);

            // 点击按钮，修改时间范围，触发表格刷新
            $(document).on("click", ".btn-filter", function () {
                var label = $(this).text();
                var obj = $(this).closest("form").find(".datetimerange").data("daterangepicker");
                var dates = obj.ranges[label];
                obj.startDate = dates[0];
                obj.endDate = dates[1];
                obj.clickApply();
            });

            // 自动刷新页面
            setTimeout(function () {
                console.log('setTimeout');
                $('#form1 .btn-filter:eq(3)').trigger('click');
            }, 1500);

            // 选项卡切入事件
            $(document).on("click", "#resetecharts", function () {
                setTimeout(function () {
                    $(window).trigger("resize");
                }, 50);
            });

            // 渲染form
            Form.api.bindevent($("#form1"));
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});